import * as THREE from 'three'
import createApp from '../../core'

function createWireframeGeometry (dom: HTMLElement) {
  const { camera, scene, update } = createApp(dom)
  camera.position.set(0, 0, 100)
  camera.lookAt(scene.position)

  const mesh = createWireframeFromGeometry()
  mesh.position.x = -40
  scene.add(mesh)

  update((time: number) => {
    const angle = time / 1000
    mesh.rotation.set(angle, angle, 0)
  })
}

function createWireframeFromGeometry () {
  const box = new THREE.BoxBufferGeometry(20, 20, 20)
  const wireframe = new THREE.WireframeGeometry(box)
  const material = new THREE.LineBasicMaterial({ color: 0xff0000 })
  const line = new THREE.LineSegments(wireframe, material)
  return line
}

export {
  createWireframeGeometry
}
